@import '~@src/common/less/1px_border.less';
// @import '~@common/less/reset.less';
.customerCenterDetail::-webkit-scrollbar{
	display: none;
   /* background-color:transparent; */
}
*{
    margin: 0;
    padding: 0;
}
span{
    vertical-align: inherit;
}
.tools-box{
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 5
}
// 辅助工具
.tools-container{
    background: rgba(0,0,0,0.70);
    border-radius: 6px;
    padding: .4rem;
    margin: .6rem;
    margin-bottom:0;
    color:#fff;
    position: relative;
    .tools-title{
        margin-bottom: .5rem
    }
    .tools-btn-box{
        width: 95%;
        // height: 1.3rem;
        overflow: hidden;
        .tools-btn{
            background-image: linear-gradient(135deg, #FF6F1A 0%, #FFB46F 100%);
            border: .05rem rgba(218,176,120,1) solid;
            color:#fff;
            margin-right: .4rem;
            border-radius: .65rem;
            margin-bottom: .4rem;
            padding: .3rem .4rem;
            // height: 0.8rem;
            // line-height: 0.7rem;
            font-size: .65rem;
            &:last-child{
                margin-bottom: 0;
                margin-right: 0
            }
        }
    }
    .tools-toggle-btn{
        position: absolute;
        right: .5rem;
        top: .6rem;
        cursor: pointer;
        i{
            font-size: 1.1rem
        }
    }
}
.has-pointer{
    cursor: pointer;
}
.show-more-tools{
    height: auto !important
}
.stepWrapper {
    width: 100%;
    box-sizing: border-box;
    .steps-box {
        width: 100%;
        display: flex;
        white-space: nowrap;
        .step-item {
            flex: 1;
            width: 100%;
            .step-style {
                width: 100%;
                height: 1.3rem;
                box-sizing: border-box;
                padding: .4rem 0;
                position: relative;
                .step-icon {
                    width: .5rem;
                    height: .5rem;
                    background: #E9E9E9;
                    border-radius: 100%;
                    position: absolute;
                    z-index: 1;
                }
                .active-icon {
                    background: #FF8637;
                }
                .step-line {
                    width: 100%;
                    height: .1rem;
                    background: #E9E9E9;
                    position: absolute;
                    left: 0;
                    right: 0;
                    top: .6rem;
                }
            }
            .step-main {
                width: 100%;
                color: #707A8D;
                text-align: center;
            }
            .active-main {
                color: #141C30;
            }
            .active-style {
                width: 100%;
                height: 1.3rem;
                box-sizing: border-box;
                padding: .4rem 0;
                position: relative;
                .step-icon {
                    background: #FF8637;
                }
                .step-line {
                    width: 150%;
                    height: .1rem;
                    background: #FF8637;
                    position: absolute;
                    left: 0;
                    right: 0;
                    top: .6rem;
                    z-index: 2;
                }
                .active-line{
                    left: -100%;
                }
            }
        }
        .step-left {
            .step-main {
                width: 100%;
                text-align: left;
            }
            .step-style {
                .step-icon {
                    left: 0;
                }
            }
        }
        .step-right {
            .step-main {
                width: 100%;
                text-align: right;
            }
            .step-style {
                .step-icon {
                    right: 0;
                }
                .step-line{
                    width: 150%;
                    left: -50%;
                }
            }
        }
        .step-center {
            .step-main {
                width: 100%;
                text-align: center;
            }
            .step-style {
                .step-icon {
                    left: 50%;
                    margin-left: -.25rem;
                }
                .step-line{
                    // left: -100%;
                }
            }
        }

    }
}

.customerCenterDetail{
    font-size: .65rem;
    color:#666687;
    background-color: #F7F9FC;
    padding-bottom: 4.8rem;
    line-height: 1;
    .contentBox{
        .verticalbar{
            font-size: .55rem;
            color:#E9E9E9;
        }
        .item-block{
            margin-bottom: .5rem;
            background-color: #fff;
            &:last-child{
                margin-bottom: 0;
            }
            .item-service-block{
                display: flex;
                margin-bottom: .65rem;
                flex-wrap: wrap;
                .service-item-box{
                    padding: .25rem;
                    flex-wrap: wrap;
                    flex-basis: 33.3333%;
                }
                &:last-child{
                    margin-bottom: 0;
                }
                .service-item{
                    box-shadow: 0 0 0.25rem 0 rgba(0, 0, 0, 0.2);
                    padding: .5rem 0;
                    width: 5rem;
                    border-radius: .1rem;
                    font-size: .65rem;
                    cursor: pointer;
                    .first-h{
                        padding-left: .375rem;
                        border-left: .125rem solid #FF8637;
                        color: #FF8637;
                        margin-bottom: .4rem;
                        font-weight: bold;
                        span{
                            margin-left: .1rem
                        }
                    }
                    .second-h{
                        padding-left: .5rem;
                        color:#707A8D
                    }
                }
            }
            .item-title{
                font-size: 0.8rem;
                color:#141C30;
                padding: 0 .75rem;
                padding-right: 1.125rem;
                line-height: 2.3rem;
                position: relative;
                display: flex;
                justify-content: space-between;
                span{
                    color: #A88F7A;
                    font-size: .6rem;
                }
            }
            .item-container{
                padding: .75rem;
                .item-c-title{
                    font-size: 1rem;
                    color: #121C32;
                    margin-bottom: .5rem;
                    font-weight: bold;
                }
                .item-c-id{
                    font-size: .6rem;
                    color: #707A8D;
                    // margin-bottom: .5rem;
                    span{
                        vertical-align: top;
                    }
                    .icon-box{
                        width: .44rem;
                        // display: inline-block;
                        vertical-align: initial;
                        margin-right: .25rem;
                        i{
                            font-size: .5rem;
                        }
                    }
                }
                .item-no-margin{
                    margin-top: .4rem !important;
                }
                .item-flex-box{
                    display: flex;
                    justify-content: space-between;
                    align-items: flex-end;
                    // margin-bottom: .7rem;
                    margin-top: -.2rem;
                    height: 1.5rem;
                    .item-flex-fl{
                        flex: 1;
                    }
                    .tel-button{
                        // width: 2rem;
                        // height: 2rem;
                        text-align: center;
                        // line-height: 1.5rem;
                        // background-color:rgba(0,0,0,0.55);
                        border-radius: .75rem;
                        // color:#fff;
                        i{
                            // color: #fff
                            font-size: 1.5rem;
                            display:inline-block;
                            width: 1.5rem;
                            height:1.5rem;
                            text-align: center;
                            line-height: 1.5rem;
                        }
                    }

                }
                .labelList{
                    margin-top: .4rem;
                    span{
                        display: inline-block;
                        padding: 0.2rem;
                        color: #6D4118;
                        font-size: 0.65rem;
                        background-color:#FCF3E8 ;
                        border-radius: 0.05rem;
                        margin-right: .5rem;
                        margin-bottom: .3rem;
                    }
                    .addMore{
                        width: 0.95rem;
                        height: 0.95rem;
                    }
                    .addLabel{
                        width: 3.85rem;
                        height: 0.95rem;
                    }
                }
                .item-btn-box{
                    display: flex;
                    justify-content: space-between;
                    padding: 0 .4rem;
                    .item-btn{
                        border: .06rem #FE961D solid;
                        padding: 0 .3rem;
                        height: 1.2rem;
                        line-height: 1.2rem;
                        color: #FF8637;
                        border-radius: .1rem;
                        font-size: .6rem;
                        display: inline-block;
                        background: #FEF1E2;
                        cursor: pointer;
                        &:last-child{
                            margin-right: 0
                        }
                    }
                }
                .item-btn-start{
                    justify-content: flex-start;
                    flex-wrap: wrap;
                    .item-btn{
                        margin-right: .8rem
                    }

                }
                //
                .item-label-box{
                    .item-label-sex{
                        font-size: .55rem;
                    }
                    .item-label{
                        color:#575859;
                        display: inline-block;
                        font-size: .55rem;
                        height: .8rem;
                        line-height: .9rem;
                        //width: 0.55rem;
                        //height: 0.55rem;
                        &:last-child{
                            margin-right: 0;
                        }
                        .icon-box{
                            width: .67rem;
                            display: inline-block;
                            vertical-align: text-top;
                            margin-right: .15rem
                        }
                        i{
                            // color: #fff
                            font-size: .6rem;
                            display:inline-block;
                            width: 0.55rem;
                            height:0.55rem;
                            text-align: center;
                            line-height: 0.55rem;
                        }
                    }
                    .item-interaction{
                        border-radius: .4rem;
                        padding: 0 .3rem;
                    }
                    // 无效
                    .item-label-gray{
                        background: #D6D6D6;
                        color: #9F9F9F
                    }
                    // 流失
                    .item-label-darkBlue{
                        background: #C4CFE1;
                        color: #6A758B
                    }
                    // 沉默
                    .item-label-light-brown{
                        background: #FEF1E2;
                        color: #B59883
                    }
                    // 高活跃
                    .item-label-blue{
                        background: #EBF0FC;
                        color:#3F7BF8
                    }
                    // 高关注
                    .item-label-orange{
                        background: #FEF1E2;
                        color:#FEA76B
                    }
                }
                .item-header-third{
                    margin-top: .7rem;
                    padding-top: .8rem;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    .item-label-small-box{
                        // flex: 1;
                        .item-label-small{
                            width: 1rem;
                            height: 1rem;
                            text-align: center;
                            line-height: 1rem;
                            margin-right: .2rem;
                            display: inline-block;
                            font-size: .6875rem;
                            &:last-child{
                                margin-right: 0;
                            }
                        }
                    }
                    // .header-btn-box{
                    //     text-align: right;
                    //     color: #999;
                    //     flex-grow: 1;
                    //     .header-btn{
                    //         color:#fff;
                    //         text-align:center;
                    //         background:#FF8637;
                    //         border-radius: .75rem;
                    //         font-size: .6rem;
                    //         padding: 0 .6rem;
                    //         height: 1.2rem;
                    //         line-height: 1.2rem;
                    //     }
                    // }
                    .phone-box{
                        width: 7.4rem;
                        height: 1.5rem;
                        background-image: linear-gradient(135deg, #FF6F1A 0%, #FFB46F 100%);
                        border-radius: .75rem;
                        text-align: center;
                        line-height: 1.5rem;
                        color: #fff;
                    }
                    .nophone-box{
                        width: 2.5rem;
                        height: 1.5rem;
                        background: #F8F8F8;
                        border: 1px solid #666687;
                        border-radius: .75rem;
                        text-align: center;
                        line-height: 1.5rem;
                    }
                    
                }
                .cusdata-box{
                    margin-top: 1.05rem;
                    .header-btn{
                        width: 5.35rem;
                        height: 1.3rem;
                        background: #FEF1E2;
                        border-radius: .65rem;
                        font-size: .7rem;
                        color: #FF8637;
                    }
                    span{
                        font-size: .5rem;
                    }
                }
            }
            // 资金量
            .financing-volume-box{
                display: flex;
                justify-content: space-between;
                align-items: center;
                position:relative;
                cursor: pointer;
                i{
                    color: #999
                }
                .financing-volume{
                    color: #FF8637;
                    font-size: .7rem;
                    margin-bottom: .4rem;
                    position: relative;
                    padding-left: .5rem;
                    .line-5{
                        position: relative;
                        // left: 0.9rem;
                        height: 0.9rem;
                        margin: 0.7rem 0;
                        padding-left: .25rem;
                        border-left: solid rgba(255, 134, 55, 0.4) 0.05rem;
                        font-size: 0.7rem;
                        font-weight: bold;
                        line-height: 0.8rem;
                        // height:100%;
                        // background: #FF8637;
                        // display: inline-flex;
                        // position: absolute;
                        // width: .1rem;
                        // left:0;
                        &::before{
                            width: .1rem;
                            content: '';
                            display: inline-block;
                            height: .9rem;
                            background: #FF8637;
                            position: absolute;
                            top: 0;
                            left: -0.25rem;
                        }
                    }
                    .line-2{
                        height:100%;
                        width: .05rem;
                        // left: .225rem;
                        position: absolute;
                        background: rgba(255,134,55,.4);
                        display: inline-flex
                    }
                }
                .received-financing{
                    font-size: .6rem;
                    color: #666687;
                    padding-left: .6rem
                }

            }


            // 客户意向
            // .intention-list{
            //     box-sizing: border-box;
            //     margin-bottom: -.7rem;
            //     li{
            //         display: flex;
            //         flex-direction: column;
            //         box-sizing: border-box;
            //         background-color: #fff;
            //         width:49%;
            //         color: #707A8D;
            //         justify-content: center;
            //         align-items: center;
            //         display: inline-block;
            //         margin-bottom: .7rem;
            //         span.text{
            //             color:#666687;
            //             margin-left: .2rem;
            //             margin-right: .2rem;
            //             font-weight: 500;
            //         }
            //         span.cycle{
            //             width: .3rem;
            //             height: .3rem;
            //             border-radius: 100%;
            //             display: inline-block;
            //             margin-top: -.2rem;
            //             margin-right: .2rem;
            //             vertical-align: middle;
            //             background-image: linear-gradient(-135deg, #FF6F1A 0%, #FFB46F 100%);

            //         }
            //     }
            // }
            // 客户服务
            .service{
                box-shadow: 0 0 .25rem 0 rgba(0,0,0,0.20);
                border-radius: .1875rem;
                margin-bottom: .75rem;
                &:last-child{
                    margin-bottom: 0;
                }
                // padding-bottom: 2.125rem;
                // height: 8.55rem;
                .service-title{
                    background: #FEF1E2;
                    padding: .6rem;
                    color:#666687;
                    font-size: .75rem;
                    line-height: 1rem;
                    border-radius: .075rem .075rem 0 0;
                    font-weight: bold;
                }
                .service-container{
                    padding: .8rem .6rem ;
                    color:#666687
                }
                .service-order-item{
                    // padding: .25rem .375rem;
                    // padding-top: .8rem;
                    // display: flex;
                    // align-items: center;
                    color:#141C30;
                    font-size: .6rem;
                    margin-bottom: 1.25rem;
                    font-weight: bold;
                    p{
                        line-height: 1.4
                    }
                    span{
                        color: #707A8D
                    }
                    span.date-style{
                        margin-left: .3125rem;
                    }
                    .icon-box{
                        // width: 1rem;
                        display: inline-block;
                        margin-right: .4rem;
                        i{
                            font-size: 1.1rem;
                            color: #FF6F1A;
                        }
                        .img{
                            height: 1rem;
                            width: 1rem;
                        }
                    }
                }
                .service-link{
                    padding-top: 1.25rem;
                    color:#FF8637;
                    font-weight: bold;
                }
                .service-link-no{
                    margin-bottom: .5rem;
                    padding: 0;
                    &:last-child{
                        margin-bottom: 0
                    }
                }
            }
            // 客户服务步骤
            .service-step{
                margin-top: 1.3rem;
                .step-link{
                    // padding: 10px 15px;
                    color:#FF8637;
                    font-weight: bold;
                    div{
                        margin-bottom: .4rem;
                        position: relative;
                        &:last-child{
                            margin-bottom: 0
                        }
                    }
                    .next-step-style{
                        margin-bottom: .8rem;
                        color: #141C30;

                    }
                    .guide-style{
                        margin-bottom: .5rem;
                        color:#707A8D;
                    }

                }
            }
            // 加油站
            // .service-station{
                .service-station-item{
                    box-shadow: 0 0 0.25rem 0 rgba(0, 0, 0, 0.2);
                    border-left: .2rem #FF8637 solid;
                    margin-bottom: .8rem;
                    padding: .9rem;
                    &:last-child{
                        margin-bottom: 0
                    }
                    .service-station-item-title{
                        color:#141C30;
                        font-size: .75rem;
                        font-weight: 600;
                        margin-bottom: .2rem;
                    }
                    .service-station-item-text{
                        color: #666687;
                        font-size: .6rem;
                        span{
                            color: #FF8637;
                            margin: 0 .125rem;
                            vertical-align: initial;
                        }
                    }
                }

            // }
        }
    }
}
// 遮罩层
.mask{
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    z-index: 999;
    background: rgba(0,0,0,.6);
  }
// 提示
.tip-box{
    display: flex;
    justify-content: center;
    align-items: center;

    height: 100%;
    .tip-box-container{
        width: 80%;
        background: #fff;
        align-items: center;
        border-radius: .3rem;
    }
    .tip-box-title{
        background: #FEF1E2;
        color: #141C30;
        font-size: .65rem;
        padding: 0 .25rem;
        border-radius: .3rem .3rem 0 0;
    }
    .tip-box-item{
        display: flex;
        // justify-content: space-between;
        font-size: .55rem;
        color: #707A8D;
        .tip-left{
            padding: .7rem 0;
            // width: 4.75rem;
            .first-col{
                width: 4.5rem;
                text-align: center;
            }
        }
        .text-center{
            text-align: center;
        }
        .tip-right{
            padding: .7rem .4rem
        }
    }
    .tip-box-body{
       padding: 0 .25rem
    }
    .tip-box-footer{
        text-align: center;
        padding: 1.15rem 0;
        .tip-button{
            padding: .4rem 1.8rem;
            color: #fff;
            font-size: .6rem;
            background: #FF8637;
            border-radius: .2rem;
        }
    }
}
.labelMask{
    position: fixed;
    top: 0;
    height: 100%;
    z-index: 99999;
    width: 100%;
    background-color: rgba(0,0,0,0.65);

    .labelBlock {
        width: 13.5rem;
        margin: 4.1rem auto 0;
        background: #FFFFFF;
        border-radius: 0.1rem;
        max-height: 21rem;
        overflow-y: auto;
        .title {
            height: 2.475rem;
            display: flex;
            line-height: 2.475rem;
            align-items: center;
            justify-content: center;
            border-bottom: 0.025rem solid #E5E5E5;

            p {
                font-size: 0.9rem;
                color: #141C30;
            }

            img {
                position: absolute;
                right: 3.35rem;
                width: 0.75rem;
                height: 0.75rem;
            }
        }

        .contentBlock {
            margin: 0.875rem 0.75rem 0.5rem;

            .checkLabel {
                font-size: .8rem;
                color: #141C30;
                margin-left: .2rem;
                padding: .15rem 0;
            }

            .checkList {
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;
                margin-top: .85rem;

                p {
                    width: 5.3rem;
                    height: 1.8rem;
                    line-height: 1.8rem;
                    background-image: url("../../../img/detailIcon/chooseBgc.png");
                    background-size: contain;
                    color: #6D4118 ;
                    font-size: 0.7rem;
                    text-align: center;
                    border-radius: 0.1rem;
                    margin-bottom: .85rem;
                }
            }

            .moreLabel {
                font-size: .8rem;
                color: #141C30;
                margin-left: .2rem;
                padding: .15rem 0;
            }

            .moreList {
                margin: .85rem 0 .5rem;
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;

                p {
                    width: 5.3rem;
                    height: 1.8rem;
                    color: #141C30;
                    font-size: 0.7rem;
                    text-align: center;
                    background-color: #F5F5F5;
                    border-radius: 0.1rem;
                    margin-bottom: 1rem;
                    line-height: 1.8rem;
                }
            }
        }

        .confirm {
            height: 2.5rem;
            line-height: 2.5rem;
            border-top: 1px solid #E5E5E5;
            text-align: center;
            margin-top: 0.5rem;
            p{
                font-size: .9rem;
                color: #6D4118;
            }
        }
    }
}
.modal-open{
    width: 100%;
    position: fixed;
}
.needshow{
    display: flex;
    justify-content: space-between;
    align-items: center;
    .activeTitle{
        width: 16rem;
        height: 1.6rem;
        line-height: .8rem;
        font-size: .65rem;
        //display: -webkit-box;
        //-webkit-box-orient: vertical;
        //-webkit-line-clamp: 2;
        overflow: hidden;

      display: flex;
      align-items: center;

      .activeTitleCont {
        font-size: .65rem;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        //overflow: hidden;
        white-space:normal;
        word-break:break-all;

      }
    }
}
.commonInformation{
    padding: 0.6rem !important;
    margin-left: -0.8rem;
    margin-right: -0.8rem;
    .item-btn{
        margin-left: .8rem;
        margin-right: 0 !important;
        margin-bottom: .6rem;
    }
}